<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>班组重点工作情况</title>

    <!-- Bootstrap -->
    <link href="plug-in/bootstrap3/css/bootstrap.min.css" rel="stylesheet">

	<script src="plug-in/jquery/jquery-1.11.3.min.js"></script>
    <script src="plug-in/bootstrap3/js/bootstrap.min.js"></script>
    <script src="plug-in/jquery-plugs/vticker/jquery.vticker.min.js"></script>
    
    <script src="plug-in/echarts3/echarts.min.js"></script>
    
    <style>
      .dowebok { width: 100%; margin: 0 auto;}
      .dowebok li { width: 1480px; overflow: hidden; zoom: 1;}
      
    </style>
  </head>
<body>
  <div class="container-fluid" style="width:98%;height:auto;">
  
  	<div class="row text-center"  style="margin-top:5px;">
       <div class="col-sm-2">
            <div style="padding-top:10px;height:40px;font-weight:bold;background:url(webpage/com/buss/images/title.png) repeat;background-size:100% 100%;" >班组情况</div>
       </div>
       <div class="col-sm-6">
          <div style="padding-top:10px;margin-left:5%;margin-right:5%;height:40px;font-weight:bold;background:url(webpage/com/buss/images/title.png) repeat;background-size:100% 100%;" >${TeamInfo.bzName }当月累计电费回收情况</div>
       </div>
       <div class="col-sm-4">
           <div style="padding-top:10px;height:40px;font-weight:bold;background:url(webpage/com/buss/images/title.png) repeat;background-size:100% 100%;" >当月巡视情况</div>
       </div>
  	</div>
  	
  	<div class="row"  >
       <div class="col-sm-2" style="height:160px;background:url(webpage/com/buss/images/frame.png) no-repeat;background-size:100% 100%;padding:15px;margin-top:30px;">
            <!-- 班组概况-->
             <p > ${TeamInfo.remark }</p>
          
       </div> 
       
       <div class="col-sm-6">
           <!-- 班组当月电费回收情况图表 -->
           <div id="dfhs_charts" style="width: 100%;height:240px;float:left;"></div>
       </div>
       
       <div class="col-sm-4">
           <!-- 班组当月巡视情况图表 -->
           <div id="inspec_charts" style="width: 100%;height:240px;float:left;"></div>
       </div>
  	</div>
  	
  	<div class="row" >
  	  <div class="col-sm-12 text-center" > 	
           <div   style="margin:0 auto;width:580px;font-weight:bold;font-size:16px;height:35px;background:url(webpage/com/buss/images/headline.png) no-repeat;background-size:100% 100%;" >${TeamInfo.bzName }重点工作情况</div>
       </div>
  	</div>
  	
  <div>
	<ul style="padding:0;margin:0;"> 
	    <li style="width: 1480px; overflow: hidden; zoom: 1;">
			<div class="row text-center" style="font-weight:bold;font-size:13px;">
		 	     <div class="col-md-1" style="width:5%;">用检员</div>
		  	     <div class="col-md-1" style="width:5%;">用检户</div>
		  	     <div class="col-md-1" style="width:5%;">欠  费<br/>（万）</div>
		  	     <div class="col-md-1" style="width:5%;">回收率<br/>（%）</div>
		  	     <div class="col-md-1" style="width:7%;">当月巡检<br/>户数</div>
		  	     <div class="col-md-1" style="width:8%;">已参与电力<br/>保障次数</div>
		  	     <div class="col-md-1" style="width:10%;">当月应急抢修<br/>/故障处理次数</div>
		  	     <div class="col-md-1" style="width:10%;">累计已办结<br/>传票数</div>
		  	     <div class="col-md-1" style="width:10%;">累计已办结<br/>95598工单数</div>
		  	     <div class="col-md-1" style="width:10%;">累计已办结<br/>12345工单数</div>
		  	     <div class="col-md-1" style="width:10%;">阶段性重点工作</div>  	     
		  	     <div class="col-md-1" style="width:15%;">
		  	         <div class="row">
		                <div class="col-md-6">低压费控<br/>推广户数</div>
		                <div class="col-md-6">预结算比例<br/>（%）</div>
		              </div>
		         </div> 
		  	  </div>
		 </li>
     </ul>
	</div>
	
  	<div class="dowebok">
		<ul style="padding:0;margin:0;"> 
		
		</ul>
	</div>

  
<!--   	<table class="table table-striped " style="margin-top:10px;font-size:12px;" >
  	  <thead>
	     <tr style="font-weight:bold;" class="text-center" >
		  <th class="active">用检员</th>
		  <th class="active">用检户</th>
		  <th class="active">欠  费<br/>（万）</th>
		  <th class="active">回收率<br/>（%）</th>
		  <th class="active">当月巡检<br/>户数</th>
		  <th class="active">已参与电力<br/>保障次数</th>
		  <th class="active">当月应急抢修<br/>/故障处理次数</th>
		  <th class="active">累计已办结<br/>传票数</th>
		  <th class="active">累计已办结<br/>95598工单数</th>
		  <th class="active">累计已办结<br/>12345工单数</th>
		  <th class="active">阶段性重点工作</th>
		  <th class="active">掌上电力<br/>推广户数</th>
		  <th class="active">低压费控<br/>推广户数</th>
		  <th class="active">预结算比例<br/>（%）</th>
		  </tr>
		</thead>
	    <tbody > 
		
		</tbody>		
	</table> -->
 
  </div>
  
      <script type="text/javascript">
      $(function(){
    	  loadDfhsChats();
          loadInspeChats();
          loadKeyWork();
    	  
          
      });     
    	
       
    	
    	 // 班组电费回收图表加载
    	function loadDfhsChats(){
            var dfhsChart = echarts.init(document.getElementById('dfhs_charts'));
            dfhsChart.clear();  
            dfhsChart.showLoading({text: '正在努力的读取数据中...'});  
            
            $.getJSON('homeController.do?getTeamPowerRateRecovery&team=${teamId}', function (data) {  
                if (data.success) {  
                	dfhsChart.setOption($.parseJSON(data.msg));  
                	dfhsChart.hideLoading();  
                } else {  
                    alert('提示', data.msg);  
                }  
            }); 
    	}
    	 
    	 // 班组当月巡视情况图表加载
    	function loadInspeChats(){ 
            var inspecChart = echarts.init(document.getElementById('inspec_charts'));
            inspecChart.clear();  
            inspecChart.showLoading({text: '正在努力的读取数据中...'}); 
        	
        	$.getJSON('homeController.do?getInspections&team=${teamId}', function (data) {  
                 if (data.success) {  
                	 inspecChart.setOption($.parseJSON(data.msg));  
                	 inspecChart.hideLoading();  
                 } else {  
                     alert('提示', data.msg);  
                 }  
             });
    	 }

    	// 班组当月重点工作加载 
    	function loadKeyWork(){
    		 $.getJSON('homeController.do?getKeyWork&team=${teamId}', function (data) {  
                 if (data.success) {  
                	 var i = 0;
                	 $.each(data.obj,function(n,value) { 
                		  var key_work = '';
                		  var bgColor ="#f4f7f9";
                          if(value.key_work)key_work = value.key_work;
                          i++;
                          if(i%2==0)bgColor="#fdefb";
                          var lis = "";
                         /*  trs  =  "<tr class='text-center'>"+
                                      "<td>" + value.checker_name +"</td>"+    //用检员
                                      "<td> </td>"+                            //用检户
                                      "<td>" + value.arrearage +"</td>"+       //欠  费
                                      "<td>" + value.rateofrecovery +"</td>"+  //回收率 
                                      "<td>" + value.inspections +"</td>"+     //当月巡检
                                      "<td>" + value.power_guarants +"</td>"+  //已参与电力保障次数
                                      "<td>" + value.emergency_repairs +"</td>"+  //当月应急抢修/故障处理次数
                                      "<td>" + value.summon +"</td>"+          //累计已办结传票数
                                      "<td>" + value.wos95598 +"</td>"+  //累计已办结95598工单数
                                      "<td>" + value.wos12345 +"</td>"+  //累计已办结12345工单数
                                      "<td>" + key_work +"</td>"+  //阶段性重点工作
                                      "<td>" + value.parlm_extension +"</td>"+  //掌上电力推广户数
                                      "<td>" + value.low_extension +"</td>"+  //低压费控<br/>推广户数
                                      "<td>" + value.settle_proportion +"</td>"+  //预结算比例
                                   "</tr>"; */
                                   
                             lis  = " <li  style=\"width: 1500px; overflow: hidden; zoom: 1;background-color:"+bgColor+";\">"+
                                       "<div class=\"text-center\" style=\"font-size:13px;margin-left:-15px;\">"+
		                            	    " <div style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.checker_name +"</div>"+
		                            	    " <div  style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">用检户</div>"+
		                            	    " <div  style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.arrearage +"</div>"+
		                            	    " <div style=\"width:5%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.rateofrecovery +"</div>"+
		                            	    " <div  style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.inspections +"</div>"+
		                            	    " <div style=\"width:8%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.emergency_repairs +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.emergency_repairs +"</div>"+
		                            	    " <div style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.summon +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.wos95598 +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.wos12345 +"</div>"+
		                            	    " <div  style=\"width:10%;float:left;margin-bottom:10px;margin-top:-10px;\">" + key_work +"重点工作 </div>  	"+     
		                            	   // " <div  style=\"width:15%;\">"+
		                            	       // " <div class=\"row\">"+
		                                         " <div style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.low_extension +"</div>"+
		                                         " <div style=\"width:7%;float:left;margin-bottom:10px;margin-top:-10px;\">" + value.settle_proportion +"</div>"+
		                                      // " </div>"+
		                                 //  "  </div> "+
		                            	 " </div>"+
		                            "</li>";
                                   
                                   
                		  $(".dowebok ul ").append(lis);       
                      });
                	
                	 
                	 $('.dowebok').vTicker({
                		 speed: 1000,     //滚动速度，单位毫秒。
                		 pause: 5000,        //暂停时间，就是滚动一条之后停留的时间，单位毫秒。
                		 showItems: 10,      //显示内容的条数
                		 animation: 'fade',  //动画效果，默认是fade，淡出。
                		 mousePause: true,   //鼠标移动到内容上是否暂停滚动，默认为true。
                		 //height: 235,        //滚动内容的高度。
                		 direction: 'up'     //滚动的方向，默认为up向上，down则为向下滚动。
                  	  }); 
                      
                 } else {  
                     alert('提示', data.msg);  
                 }  
             });
    	 }

       
    	
    	
     
    </script>
</body>
</html>